<template>
    <van-nav-bar title="区域选择" @click-left="onClickLeft" left-text="返回" left-arrow></van-nav-bar>
    <div class="regionPage">
        <div>
            <!-- <van-tabs :active="active" @click-tab="handleChange">
                <van-tab name="0" title="区县" key="区县"></van-tab>
                <van-tab name="1" title="网格" key="网格"></van-tab>
            </van-tabs> -->
            <div
                style="padding: 10px 0;display: flex; flex-direction: column;gap: 10px;border-radius: 20px;overflow: hidden;">
                <van-cell @click="goPoster(item)" :title="item" is-link v-for="item in county" />

            </div>
        </div>
    </div>

</template>
<script setup>
import { useRouter, useRoute } from "vue-router";
import { ref } from "vue"
const router = useRouter();
const route = useRoute();
const active = ref(0)
const county = ref([
    '延安市',
    '宝塔区',
    '安塞区',
    '子长县',
    '延长县',
    '延川县',
    '志丹县',
    '吴起县',
    '甘泉县',
    '富县',
    '洛川县',
    '宜川县',
    '黄龙县',
    '黄陵县',
])
const onClickLeft = () => {
    router.push({
        path: "/main"
    });
};


function handleChange(changeData) {
    active.value = changeData.name
}
function goPoster(scope) {
    router.push(
        {
            path: "/uniquePath-time",
            query: {
                type: route.query.type,
                scope
            }
        }
    );
}

</script>

<style>
.regionPage {
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    padding: 10px;
}

.van-tabs__line {
    width: 200px;
    background-color: #1989fa;
}

.van-cell__title {
    text-align: left;
}
</style>